<template>
  <div>
    <el-table :data="tableData" style="width: 100%" :header-cell-style="{ background: '#fafafa', color: '#606266' }">
      <el-table-column prop="number" label="试题编号" width="120"> </el-table-column>
      <el-table-column prop="subject" label="学科" width="120"> </el-table-column>
      <el-table-column prop="catalog" label="目录" width="120"> </el-table-column>
      <el-table-column prop="questionType" label="题型" width="120" :formatter="editType"> </el-table-column>
      <el-table-column prop="question" label="题干" width="280">
        <template slot-scope="scope">
          <p v-html="scope.row.question"></p>
        </template>
      </el-table-column>
      <el-table-column prop="addDate" label="录入时间" width="180" :formatter="editTime"> </el-table-column>
      <el-table-column prop="difficulty" label="难度" width="80" :formatter="editDif"> </el-table-column>
      <el-table-column prop="creator" label="录入人" width="120"> </el-table-column>
      <el-table-column prop="chkState" label="审核状态" width="120" :formatter="editChk"> </el-table-column>
      <el-table-column prop="chkRemarks" label="审核意见" width="150"> </el-table-column>
      <el-table-column prop="chkUser" label="审核人" width="120"> </el-table-column>
      <el-table-column prop="publishState" label="发布状态" width="150" :formatter="editPub"> </el-table-column>
      <el-table-column fixed="right" label="操作" min-width="200" align="center">
        <template slot-scope="scope">
          <el-button @click="handleClickSee(scope.row.id)" type="text" size="small">预览</el-button>
          <el-button type="text" size="small" @click="handleClickAudit(scope.row.id)" :disabled="scope.row.chkState !== 0">审核</el-button>
          <el-button type="text" size="small" @click="handleClickEdit(scope.row)" :disabled="scope.row.publishState === 1">修改</el-button>
          <el-button type="text" size="small" @click="handleClickUnder(scope.row)">{{ scope.row.publishState === 1 ? '下架' : '上架' }}</el-button>
          <el-button type="text" size="small" @click="handleClickDel(scope.row.id)" :disabled="scope.row.publishState === 1">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      style="margin-top: 30px; margin-bottom: 20px; float: right"
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-size="pageSize"
      layout="total,  prev, pager, next, jumper"
      :total="counts"
    >
    </el-pagination>
  </div>
</template>
<script>
import { questionType, difficulty, publishType, chkType } from '@/api/hmmm/constants'
import { parseTimeByString } from '@/filters'
export default {
  props: {
    tableData: {
      type: Array,
      required: true
    },
    counts: {
      type: Number,
      default: 10
    },
    currentPage: {
      type: Number,
      default: 1
    },
    pageSize: {
      type: Number,
      default: 5
    }
  },
  data () {
    return {
      questionType,
      difficulty,
      publishType,
      chkType
    }
  },
  methods: {
    handleClick (row) {
      console.log(row)
    },
    handleSizeChange (v) {
      this.pageSize = v
    },
    handleCurrentChange (v) {
      //   this.$parent.currentPage = v
      this.$emit('handleChange', v)
    },
    // 格式化题型内容
    editType (row) {
      // console.log(this.questionType)
      // console.log(row.questionType)
      this.questionType.forEach((item) => {
        if (item.value === +row.questionType) {
          row.questionType = item.label
        }
      })
      return row.questionType
    },
    // 格式化难度内容
    editDif (row) {
      this.difficulty.forEach((item) => {
        if (item.value === +row.difficulty) {
          row.difficulty = item.label
        }
      })
      return row.difficulty
    },
    // 格式化时间内容
    editTime (row) {
      // console.log(row.addDate)
      row.addDate = parseTimeByString(row.addDate)
      return row.addDate
    },
    // 格式化审核状态
    editChk (row) {
      this.chkType.forEach((item) => {
        if (item.value - 1 === row.chkState) {
          row.chkType = item.label
        }
      })
      return row.chkType
    },
    // 格式化发布状态
    editPub (row) {
      this.publishType.forEach((item) => {
        if (item.value === row.publishState + 1) {
          row.publishType = item.label
        }
      })
      return row.publishType
    },
    handleClickSee (v) {
      this.$emit('handleClickSee', v)
    },
    handleClickAudit (v) {
      this.$emit('handleClickAudit', v)
    },
    handleClickEdit (v) {
      this.$emit('handleClickEdit', v)
    },
    handleClickUnder (v) {
      this.$emit('handleClickUnder', v)
    },
    handleClickDel (v) {
      this.$emit('handleClickDel', v)
    }
  }
}
</script>
<style lang="less" scoped>
</style>
